<template>
  <!-- 用户信息 -->
  <Modal title="用户信息" :value="showModal" @on-cancel="closeModal" :footer-hide="true">
    <div>
      <div class="info-title">账号:</div>
      <div class="info-content">{{ userdata.username }}</div>
      <div class="info-title">用户名:</div>
      <div class="info-content">{{ userdata.name }}</div>
      <div class="info-title">用户等级:</div>
      <div class="info-content">{{ userdata.level }}</div>
    </div>
    <div><Button type="primary" @click="closeModal">确定</Button></div>
  </Modal>
</template>

<script>
export default {
  props: {
    showModal: {
      type: Boolean,
      default: false
    },
    userdata: {
      type: Object,
      default: () => { }
    }
  },
  methods: {
    closeModal () {
      this.$emit('closeModal')
    }
  }
}
</script>

<style lang="scss" scoped>
.info-title {
  font-size: 19px;
}
.info-content {
  margin: 10px 0 10px 0;
}
</style>